<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<title>管理平台</title>
<jsp:include page="../../include/header.jsp"></jsp:include>

</head>
<body>
	<div id="wrapper">
		<jsp:include page="../../include/nav.jsp"></jsp:include>
		<!-- <div id="page-wrapper"> -->
			<div class="row">
				<div class="col-lg-12">
					<h1 class="page-header">分类管理</h1>
					<div class="pull-right">
						<button type="button"
							onclick="javascript:window.location.reload()"
							class="btn btn-success btn-lg btn-refresh">
							<span class="fa fa-refresh fa-lg"></span>
						</button>
					</div>

				</div>
			</div>
			<div class="row">
				<div class="col-lg-12">
					<div class="row">
						<!-- <div class="col-lg-6"> -->
						<div class="text-muted single-line-text pull-left">
							共 <font color="#428bca" id="dataCount">0</font> 条记录
							<!-- <h2>数据列表</h2> -->
						</div>
						<div style="float: right; margin-right: 30px;">
							<div class="pull-right">
								<button type="button" class="btn btn-success" onclick="toAdd()">
									<span class="fa fa-plus"></span> 添加
								</button>
								
								<button type="button" class="btn btn-success" onclick="doSort()">
									<span class="fa fa-save"></span>排序
								</button>
							</div>

						</div>

					</div>
					<div class="table-responsive">
					<form id="sortForm" action="${BASE_PATH}/contents/category/doSort"
							method="post">
						 <input type="hidden" name="sortKey" value="orderNo">
					
					
						<table id="dataTable" class="table table-striped table-hover">
							<thead>
								<tr>
									<th>编号</th>
									<th>分类图标</th>
									<th>分类名称</th>
									<!-- <th>专题数量</th> -->
									<th>是否显示</th>
									<th>排序</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody id="dataList"></tbody>
						</table>
						</form>
					</div>
					<div class="row">
						<div class="col-lg-12">
							<ul id="dataPagination" class="pagination-sm pull-right"></ul>
						</div>
					</div>
				</div>
			</div>
		</div> 
		<jsp:include page="../../include/footer.jsp"></jsp:include>
	<!-- </div> -->
	<jsp:include page="../../include/javascripts.jsp"></jsp:include>
	<!-- 异步加载下一页数据后，用模板渲染 -->
	<script type="text/html" id="dataTpl">
	{{each list as item}}
	<tr id="item{{item.id}}" data-id="{{item.id}}">
		<td>{{item.id}}</td>
		<td><a href="javascript:void(0)" onclick="Kit.photo('${FTP_PATH}{{item.thumb}}')"><img src="${FTP_PATH}{{item.thumb}}"></a></td>
		<td>{{item.name}}</td>
		
		<td>{{item.state | flagTransform:1,'显示',0,'不显示' }}</td>
		<td><input name="orderNo{{item.id}}" value="{{item.orderNo}}" size="3" class="order form-control width50" required></td>
		<td><button type="button" class="btn btn-sm btn-primary btn-simple" onclick="toEdit('{{item.id}}')" title="编辑"><span class="fa fa-edit fa-lg"></span></button> <button type="button" class="btn btn-sm btn-danger btn-simple" onclick="toDelete('{{item.id}}')" title="删除"><span class="fa fa-remove fa-lg"></span></button></td>
	</tr>
	{{/each}}
</script>
	
	<script type="text/javascript">
		var dataPaginator;
		$(function() {
			dataPaginator = Kit.pagination("#dataPagination",
					"${BASE_PATH}/contents/category/page", {
						"pageSize" : 10
					}, function(result) {
						//设置显示最新的数据数量
						$("#dataCount").html(result.object.totalRow);
						//根据模板渲染数据并填充
						$("#dataList").empty().append(
								template("dataTpl", result.object));
					});
		});
		var addDialog;
		function toAdd() {
			addDialog = Kit
					.dialog("添加", "${BASE_PATH}/contents/category/toAdd")
					.open();
		}
		var editDialog;
		function toEdit(id) {
			editDialog = Kit.dialog("编辑",
					"${BASE_PATH}/contents/category/toEdit/" + id).open();
		}
		function onEditSuccess(id, newObject) {
			$("#item" + id).replaceWith(template("list-tpl", {
				"list" : [ newObject ]
			}));
		}

		function toDelete(id) {
			Kit.confirm("提示", "您确定要删除这条数据吗？", function() {
				$.post("${BASE_PATH}/contents/category/doDelete/" + id,
						function(data) {
							switch (data.flag) {
							case -1:
								Kit.alert("网络繁忙...");
								return;
							case 1:
								Kit.alert("当前有活动使用这个分类，无法删除");
								return;
							case 0:

								$("#item"+id).remove();
							}

						});
			});
		}


		
		 function doSort() {
			$("#sortForm").ajaxSubmit({
				success : function(data) {
					switch (data.flag) {
					case -1:
						Kit.alert("网络繁忙...，请重试");
						return;
					case 0:
						window.location.reload();
					}
				}
			});
		}   
	</script>
</body>
</html>